<template>
  <div>
    <el-table :data="SonData" style="width: 100%">
    <el-table-column prop="date" label="Date" width="180" />
    <el-table-column prop="name" label="Name" width="180" />
    <el-table-column prop="address" label="Address" />
  </el-table>
  </div>
</template>

<script lang='ts' setup>
import {  ref,onMounted,watch } from 'vue'
const props = defineProps<{
    tableData:any
}>()
const SonData = ref([])
//父传子，子组件无法正常渲染的问题，需要监听
watch(() => props.tableData,()=>{
    console.log(props.tableData,'tabledata');
    SonData.value = props.tableData
},{deep:true,flush:'post'})

</script>
<style lang="scss" scoped>
</style>